import React, { Component } from 'react'

export default class Pl extends Component {
    flag = false
    showPickFace = ()=>{
        // console.log(this.refs.face);
        // this.refs.face.style.display="block"
        if(!this.flag){
            this.refs.face.style.display = 'block'
            this.flag = true;
        }else{
            this.refs.face.style.display = 'none'
            this.flag = false;
        }
    }
    flag2 = false
    showPickImg = ()=>{
        if(!this.flag2){
            this.refs.img.style.display = 'block'
            this.flag2 = true;
        }else{
            this.refs.img.style.display = 'none'
            this.flag2 = false;
        }
    }
    render() {
        return (
            <div className="card mt40" id="pl">
                <div className="bt"><h1>评论</h1></div>
                <div className="pl-520am body mt20" data-id="2041" data-classid="21">
                    <div className="pl-header">评论(<em id="pl-joinnum">1358</em>人参与，<em id="pl-totalnum">38</em>条评论) <span className="pl-userinfo" id="pl-userinfo"></span></div>
                    <div className="pl-area">
                        <div className="pl-area-userpic">
                            <img id="pl-userpic" src="/tou4.png" />      </div>
                        <div className="pl-area-post">
                            <div className="pl-post">
                                <div className="pl-textarea">
                                    <textarea className="pl-post-word" id="pl-520am-f-saytext" placeholder="文明上网，理性发言">
                                    </textarea>
                                </div>
                                <div className="pl-tools">
                                    <ul>
                                        <li onClick={this.showPickFace}><span className="pl-icon icon-face"></span></li>
                                        <li onClick={this.showPickImg}><span className="pl-icon icon-img"></span></li>
                                        <li className="ShowPlName">
                                            <div>
                                                <font>昵称:</font>
                                                <input type="text" id="pl-name" className="pl-name" size="10" placeholder="无名杀手" />
                                            </div>
                                        </li>
                                        <li className="ShowPlKey">
                                            <div>
                                                <input type="text" id="pl-key" className="pl-key" size="10" placeholder="验证码" />
                                                <img src="/e/ShowKey/?v=pl" name="plKeyImg" className="plKeyImg" onClick="lgyPl.updateKey()" title="看不清楚,点击刷新" align="absmiddle" />
                                            </div>
                                        </li>

                                        <li className="pl-tools-lastchild"><button className="pl-submit-btn" id="pl-submit-btn-main" onClick="lgyPl.submitComment(this)">发 布</button></li>
                                    </ul>
                                </div>
                                <div onClick = {this.showPickFace} className="pl-face-box" id="pl-face-box" ref="face">
                                    <div className="pl-face-box-before">
                                        <a className="pl-icon icon-face"></a>
                                    </div>
                                    <li onClick="lgyPl.addplface('[~e.jy~]',0)">
                                        <a href="javascript:;"><img src="/1.gif" width="20" height="20" border="0" /></a>
                                    </li>
                                    <li onClick="lgyPl.addplface('[~e.kq~]',0)">
                                        <a href="javascript:;"><img src="/2.gif" width="20" height="20" border="0" /></a>
                                    </li>
                                    <li onClick="lgyPl.addplface('[~e.se~]',0)">
                                        <a href="javascript:;"><img src="/3.gif" width="20" height="20" border="0" /></a>
                                    </li>
                                    <li onClick="lgyPl.addplface('[~e.sq~]',0)">
                                        <a href="javascript:;"><img src="/4.gif" width="20" height="20" border="0" /></a>
                                    </li>
                                    <li onClick="lgyPl.addplface('[~e.lh~]',0)">
                                        <a href="javascript:;"><img src="/5.gif" width="20" height="20" border="0" /></a>
                                    </li>
                                    <li onClick="lgyPl.addplface('[~e.ka~]',0)">
                                        <a href="javascript:;"><img src="/6.gif" width="20" height="20" border="0" /></a>
                                    </li>
                                    <li onClick="lgyPl.addplface('[~e.hh~]',0)">
                                        <a href="javascript:;"><img src="/7.gif" width="20" height="20" border="0" /></a>
                                    </li>
                                    <li onClick="lgyPl.addplface('[~e.ys~]',0)">
                                        <a href="javascript:;"><img src="/8.gif" width="20" height="20" border="0" /></a>
                                    </li>
                                    <li onClick="lgyPl.addplface('[~e.ng~]',0)">
                                        <a href="javascript:;"><img src="/9.gif" width="20" height="20" border="0" /></a>
                                    </li>
                                    <li onClick="lgyPl.addplface('[~e.ot~]',0)">
                                        <a href="javascript:;"><img src="/10.gif" width="20" height="20" border="0" /></a>
                                    </li>          
                                </div>
                                <div onClick = {this.showPickImg} className="pl-img-box" id="pl-img-box" ref="pl-img-box" ref="img">
                                    <div className="pl-img-box-before"><a className="pl-icon icon-img"></a></div>
                                    <div className="pl-img-file">
                                        <input placeholder="http://" type="text" />
                                        <button>添加</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div className="pl-clr"></div>
                    <div className="pl-showinfo">请先说点什么</div>
                    <div className="pl-clr"></div>
                    <div className="pl-show-good-list">
                        <div className="pl-title">推荐评论</div>
                        <div className="pl-show-list" id="pl-show-good"></div>
                    </div>
                    <div className="pl-clr"></div>
                    <div className="pl-show-hot-list">
                        <div className="pl-title">热门评论</div>
                        <div className="pl-show-list" id="pl-show-hot"></div>
                    </div>
                    <div className="pl-clr" id="pl-start"></div>
                    <div className="pl-title">最新评论</div>
                    <div className="pl-show-list" id="pl-show-all">
                        <div className="pl-area pl-show-box" id="pl-show-box-4769">
                            <div className="pl-area-userpic">
                                <img id="pl-userpic" src="/tou4.png" onClick="lgyPl.showReply(4769,'Spreds')" style={{ cursor: "pointer" }} />
                            </div>
                            <div className="pl-area-post">
                                <div className="pl-show-title pl-show-a-0"><a onClick="lgyPl.showReply(4769,'Spreds')" href="javascript:;">Spreds</a><span className="pl-show-time pl-fr">2021年06月19日 11:20</span></div>
                                <div className="pl-show-saytext pl-show-saytext-0"><div className="ecomment">
                                    <span className="ecommentauthor">回复 『流星奇迹』_兵兵 的评论：</span>
                                    <p className="ecommenttext">花女传说作者可雪儿（第八关我打不有巴我乐死哈哈哈哈哈第八关boos圣诞装之是个mod不回血第八关你们记的修改boos血修1c你们不改之打不死了ok呵呵呵<img src="/1.gif" border="0" /></p>
                                </div>捡高攻宝石或者用指虎加攻之后拿匕首的大绝击杀之</div>
                                <div className="pl-show-tools"><a id="pl-err-info-4769"></a> <a href="javascript:;" onClick="lgyPl.doForPl(4769,1,this)"><i className="pl-icon icon-good"></i><span id="pl-1-4769"></span></a> <a href="javascript:;" onClick="lgyPl.doForPl(4769,0,this)"><i className="pl-icon icon-bad"></i><span id="pl-0-4769"></span></a> <a className="pl-reply" onClick="lgyPl.showReply(4769,'Spreds')" href="javascript:;">回复</a></div>
                                <div className="pl-show-replay"></div>
                            </div>
                            <div className="pl-clr"></div>
                        </div><div className="pl-area pl-show-box" id="pl-show-box-4766">
                            <div className="pl-area-userpic">
                                <img id="pl-userpic" src="/tou2.png" onClick="lgyPl.showReply(4766,'花下道客')" style={{ cursor: "pointer" }} />
                            </div>
                            <div className="pl-area-post">
                                <div className="pl-show-title pl-show-a-0"><a onClick="lgyPl.showReply(4766,'花下道客')" href="javascript:;">花下道客</a><span className="pl-show-time pl-fr">2021年06月19日 07:32</span></div>
                                <div className="pl-show-saytext pl-show-saytext-0">与众不同的单机任务，希望可雪儿以后多做这种，玩着很清爽。</div>
                                <div className="pl-show-tools"><a id="pl-err-info-4766"></a> <a href="javascript:;" onClick="lgyPl.doForPl(4766,1,this)"><i className="pl-icon icon-good"></i><span id="pl-1-4766"></span></a> <a href="javascript:;" onClick="lgyPl.doForPl(4766,0,this)"><i className="pl-icon icon-bad"></i><span id="pl-0-4766"></span></a> <a className="pl-reply" onClick="lgyPl.showReply(4766,'花下道客')" href="javascript:;">回复</a></div>
                                <div className="pl-show-replay"></div>
                            </div>
                            <div className="pl-clr"></div>
                        </div><div className="pl-area pl-show-box" id="pl-show-box-4747">
                            <div className="pl-area-userpic">
                                <img id="pl-userpic" src="/tou7.png" onClick="lgyPl.showReply(4747,'『流星奇迹』_兵兵')" style={{ cursor: "pointer" }} />
                            </div>
                            <div className="pl-area-post">
                                <div className="pl-show-title pl-show-a-0"><a onClick="lgyPl.showReply(4747,'『流星奇迹』_兵兵')" href="javascript:;">『流星奇迹』_兵兵</a><span className="pl-show-time pl-fr">2021年06月18日 08:08</span></div>
                                <div className="pl-show-saytext pl-show-saytext-0">花女传说作者可雪儿（第八关我打不有巴我乐死哈哈哈哈哈第八关boos圣诞装之是个mod不回血第八关你们记的修改boos血修1c你们不改之打不死了ok呵呵呵<img src="/1.gif" border="0" /></div>
                                <div className="pl-show-tools">
                                    <a id="pl-err-info-4747"></a>
                                    <a href="javascript:;" onClick="lgyPl.doForPl(4747,1,this)">
                                        <i className="pl-icon icon-good"></i>
                                        <span id="pl-1-4747"></span>
                                    </a>
                                    <a href="javascript:;" onClick="lgyPl.doForPl(4747,0,this)">
                                        <i className="pl-icon icon-bad"></i>
                                        <span id="pl-0-4747"></span>
                                    </a>
                                    <a className="pl-reply" onClick="lgyPl.showReply(4747,'『流星奇迹』_兵兵')" href="javascript:;">回复</a>
                                </div>
                                <div className="pl-show-replay"></div>
                            </div>
                            <div className="pl-clr"></div>
                        </div></div>
                    <div id="pl-pagination"></div>
                    <button onClick="lgyPl.getNewsComment(0,this);" className="showAllComment buttonGray" style={{ display: "inline-block" }}>查看更多</button></div>
            </div>
        )
    }
}
